<!DOCTYPE html>
<html lang="zh-CN"
      xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
      layout:decorator="model/boardModel">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <script th:src="@{/plugins/area/CityJson.js}"></script>
    <script th:src="@{/plugins/area/ProJson.js}"></script>
    <script th:src="@{/plugins/area/DistrictJson.js}"></script>
    <title>KA列表</title>

</head>
<body>

<div th:fragment="pagenav" th:remove="tag">
    <div th:replace="model/nav :: pageheader ('门店管理','KA管理')"></div>
</div>

<div th:fragment="content" th:remove="tag">


    <div class="row">
        <div class="col-xs-12">

            <div class="box box-primary">
                <div class="box-header with-border">
                    <h3 class="box-title">查询条件</h3>
                    <div class="box-tools pull-right">
                        <button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
                    </div>
                </div>
                <!-- /.box-header -->
                <!-- form start -->
                <form role="form" id="queryForm" th:action="@{/ka/list}" method="post" >
                    <div class="box-body">
                        <div class="row">
                                <input type="hidden" th:name="agencyId" th:value="${agencyId}" />
                            <div class="col-xs-3">
                                <input type="text" th:name="kaName"  class="form-control input-sm" placeholder="KA名称"/>
                            </div>
                            <div class="col-xs-3">
                                <input type="text" th:name="contactName" class="form-control input-sm" placeholder="姓名"/>
                            </div>
                            <div class="col-xs-3">
                                <input type="text" th:name="contactPhone" class="form-control input-sm" placeholder="电话"/>
                            </div>

                            <div class="col-xs-3">
                                <button id="btn-query" type="button" class="btn btn-primary pull-right btn-sm">查询</button>
                            </div>
                        </div>
                    </div>
                    <!-- /.box-body -->

                    <div class="box-footer">

                    </div>
                </form>
            </div>


            <div class="box">

                <!-- /.box-header -->
                <div class="box-body">
                    <table id="dataTable" class="table table-striped table-bordered table-hover table-condensed">

                        <thead >
                        <tr>
                            <th>KA名称</th>
                            <th>联系人</th>
                            <th>电话</th>
                            <th>创建时间</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                    </table>
                    <!--<div th:include="model/page :: pager" th:remove="tag"></div>-->
                </div>
                <!-- /.box-body -->
            </div>
            <!-- /.box -->
        </div>
    </div>

    <div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">

                <div class="modal-header" style="background-color: #307095;">
                    <button type="button" class="close" data-dismiss="modal" id="btn_close" >
                        <span aria-hidden="true">&times;</span><span class="sr-only">关闭</span>
                    </button>
                    <h4 class="modal-title" id="myModalLabel2">员工-编辑</h4>
                </div>

                <div class="modal-body">
                    <form class="form-horizontal"  id="editForm"  method="post">
                        <input type="hidden" class="form-control" name="kaId" />
                        <input type="hidden" class="form-control" id="agencyId" name="agencyId" th:value="${agencyId}"  />
                        <input type="hidden" class="form-control" name="agencyName" th:value="${agencyName}"  />
                        <div class="form-group">
                            <label  class="col-sm-3 control-label">KA名称</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control" name="kaName" placeholder="KA名称"
                                       data-rule-required="true" data-msg-required="请录入KA名称"
                                       data-rule-minlength="2" data-msg-minlength="KA名称最少2个字符"
                                       data-rule-maxlength="20" data-msg-maxlength="KA名称最大为20个字符"
                                       />
                            </div>
                        </div>
                        <div class="form-group">
                            <label  class="col-sm-3 control-label">登陆账户名</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control" id="loginName" name="loginName"
                                       data-rule-required="true" data-msg-required="请录入管理账户名"
                                       data-rule-minlength="2" data-msg-minlength="管理账户名最少2个字符"
                                       data-rule-maxlength="20" data-msg-maxlength="管理账户名最大为20个字符"
                                       data-rule-commonString ="true" data_msg-commonString="账户名格式为字母或字母加数字"
                                       placeholder="登陆后台管理的账户名，请牢记！"/>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">联系人</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control" name="contactName" placeholder="联系人"
                                       data-rule-required="true" data-msg-required="请录入联系人"
                                       data-rule-minlength="2" data-msg-minlength="联系人最少2个字符"
                                       data-rule-maxlength="20" data-msg-maxlength="联系人最大为20个字符"/>
                            </div>
                        </div>
                       <!-- <div class="form-group">
                            <label class="col-sm-3 control-label">地区</label>
                            <div class="col-sm-9">
                                <select id="selProvince" name="provinceId" style="width: 120px;height: 34px;float:left" class="form-control select2" >
                                    <option value="0">&#45;&#45;省份&#45;&#45;</option>
                                </select>
                                <select id="selCity" name="cityId" style="width: 120px;height: 34px;float:left" class="form-control select2" >
                                    <option value="0">&#45;&#45;城市&#45;&#45;</option>
                                </select>
                                <select id="selDistrict" name="areaId" style="width: 120px;height: 34px;float:left" class="form-control select2" >
                                    <option value="0">&#45;&#45;区/县&#45;&#45;</option>
                                </select>
                            </div>
                        </div>-->
                        <div class="form-group">
                            <label  class="col-sm-3 control-label">电话</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control" name="contactPhone"  placeholder="联系电话"
                                       data-rule-required="true" data-msg-required="请录入联系电话"
                                       data-rule-iphone="true"/>
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-3 control-label">结算帐户名</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control" id="accountName" name="qhsAccountInfo.accountName"
                                       data-rule-required="true" data-msg-required="请录入结算帐户名"
                                       data-rule-minlength="2" data-msg-minlength="结算帐户名最少2个字符"
                                       data-rule-maxlength="20" data-msg-maxlength="结算帐户名最大为20个字符"
                                       placeholder="结算帐户名"/>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">结算账号</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control" id="accountNumber" name="qhsAccountInfo.accountNumber"
                                       data-rule-required="true" data-msg-required="请录入结算账号"
                                       data-rule-positiveIntegerNum="true"
                                       placeholder="请录入结算账号"/>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">开户行</label>
                            <div class="col-sm-9">
                                <input type="text" class="form-control" id="bank" name="qhsAccountInfo.bank"
                                       data-rule-required="true" data-msg-required="请录入开户行"
                                       placeholder="开户行"/>
                            </div>
                        </div>
                        <!--<div class="form-group">
                            <label  class="col-sm-3 control-label">佣金比例</label>
                            <div class="col-sm-9">
                                <input class="form-control" name="rate"  placeholder="佣金比例"/>
                            </div>
                        </div>-->
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="submit" id="btn-submit" class="btn btn-primary">提交</button>
                </div>
            </div>
        </div>
    </div>
    <div class="modal fade" id="profitModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header" style="background-color: #307095;">
                    <button type="button" class="close" data-dismiss="modal" id="btn_close" >
                        <span aria-hidden="true">&times;</span><span class="sr-only">关闭</span>
                    </button>
                    <h4 class="modal-title" id="myModalLabel2">佣金-编辑</h4>
                </div>

                <div class="modal-body">
                    <form class="form-horizontal"  id="porfitForm"  method="post">
                    <div class="form-group">
                        <label class="col-sm-3 control-label">地区</label>
                        <div class="col-sm-9">
                            <select id="selProvince" name="provinceId" style="width: 120px;height: 34px;float:left" class="form-control select2" >
                                <option value="0">--省份--</option>
                            </select>
                            <select id="selCity" name="cityId" style="width: 120px;height: 34px;float:left" class="form-control select2" >
                                <option value="0">--城市--</option>
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label  class="col-sm-3 control-label">佣金比例</label>
                        <div class="col-sm-4">
                            <input class="form-control" id="rate" name="rate"  placeholder="佣金比例"/>
                        </div>
                    </div>
                    </form>

                <div class="modal-footer">
                    <button type="submit" id="profit-add" class="btn btn-primary">添加</button>
                </div>
                <table id="profitTable" class="table table-striped table-bordered table-hover table-condensed">

                    <thead >
                    <tr>
                        <th>地区</th>
                        <th>佣金比例</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                </table>
                <div class="modal-footer">
                    <button type="submit" id="profit-submit"  class="btn btn-primary">确定</button>
                </div>
                </div>
            </div>
        </div>
    </div>
    <form role="form" id="submitForm" class="form-horizontal"  method="post" >
        <div class="box-body" id="rateforSubmit">

        </div>
    </form>
    <!-- DataTables -->
    <script type="text/javascript">

        $(function (){
            var tables = $("#dataTable").dataTable({
                serverSide: true,//分页，取数据等等的都放到服务端去
                processing: true,//载入数据的时候是否显示“载入中”
                pageLength: 10,  //首次加载的数据条数
                ordering: false,//排序操作在服务端进行，所以可以关了。
                /*pagingType: "full_numbers",*/
                autoWidth: false,
                stateSave: true,//保持翻页状态，和tables.fnDraw(false);结合使用
                searching: false,
                ajax: {   //类似jquery的ajax参数，基本都可以用。
                    type: "post",//后台指定了方式，默认get，外加datatable默认构造的参数很长，有可能超过get的最大长度。
                    url: "/ka/list",
                    dataSrc: "data",//默认data，也可以写其他的，格式化table的时候取里面的数据
                    data: function (d) {//d是原始的发送给服务器的数据，默认很长。
                        var param = {}; //因为服务端排序，可以新建一个参数对象
                        param.draw = d.draw;
                        param.start = d.start;
                        param.length = d.length;
                        var formData = $("#queryForm").serializeArray();//把form里面的数据序列化成数组
                        formData.forEach(function (e) {
                            param[e.name] = e.value;
                        });
                        return param;//自定义需要传递的参数。
                    }
                },
                columns: [//对应上面thead里面的序列
                    {"data": 'kaName'},
                    {"data": 'contactName'}, //mData 表示发请求时候本列的列明，返回的数据中相同下标名字的数据会填充到这一列
                    {"data": 'contactPhone'},
                    {"data": 'createTimeStr', defaultContent: ""},
                    {"data": null,"width":"180px"}

                ],

                /*<![CDATA[*/
                columnDefs: [
                    {
                        targets: -1,//编辑
                        data: null,//下面这行，添加了编辑按钮和，删除按钮
                        defaultContent: "<div class='btn-group'><button id='profitRow' class='btn btn-primary btn-sm' type='button'><i class='fa fa-edit'></i>佣金设置</button>"+
                        "<div class='btn-group'><button id='editRow' class='btn btn-primary btn-sm' type='button'><i class='fa fa-edit'></i>编辑</button>" +
                        "<button id='delRow' class='btn btn-primary btn-sm' type='button'><i class='fa fa-trash-o'></i>删除</button></div>"
                    }
                ],
                dom: '<"toolbar">frtip',
                /*]]>*/

                //每加载完一行的回调函数
                createdRow: function( row, data, index ) {
                    //修改单元格样式
                    //$('td', row).eq(5).css('font-weight',"bold").css("color","red");//获取到具体行具体格的元素
                },
                initComplete: function (setting, json) {
                    //初始化完成之后替换原先的搜索框。
                },
                //在每次table被draw完后调用
                /*fnDrawCallback: function(){
                 var api = this.api();
                 //获取到本页开始的条数
                 var startIndex= api.context[0]._iDisplayStart;
                 api.column(0).nodes().each(function(cell, i) {
                 cell.innerHTML = startIndex + i + 1;
                 });
                 },*/


                language: {
                    lengthMenu: "",//不显示记录条数选择
                    //lengthMenu: '<select class="form-control input-xsmall">' + '<option value="5">5</option>' + '<option value="10">10</option>' + '<option value="20">20</option>' + '<option value="30">30</option>' + '<option value="40">40</option>' + '<option value="50">50</option>' + '</select>条记录',//左上角的分页大小显示。
                    processing: "加载中",//处理页面数据的时候的显示
                    /*<![CDATA[*/
                    paginate: {//分页的样式文本内容。
                        previous: "<",
                        next: ">",
                        first: "<<",
                        last: ">>"
                    },
                    /*]]>*/
                    zeroRecords: "没有数据",//table tbody内容为空时，tbody的内容。
                    //下面三者构成了总体的左下角的内容。
                    //info: "共 _PAGES_ 页，显示第 _START_ 到第 _END_ 条 ",//筛选之后得到 _TOTAL_ 条，初始 _MAX_ 条   左下角的信息显示，大写的词为关键字。
                    info: "共 _PAGES_ 页，显示第 _START_ 到第 _END_ 条",
                    infoEmpty: "0条记录",//筛选为空时左下角的显示。0条记录
                    infoFiltered: "",//筛选之后的左下角筛选提示(另一个是分页信息显示，在上面的info中已经设置，所以可以不显示)，
                    sSearch: "关键字："
                }

            });

            /*<![CDATA[*/
            $("div.toolbar").html('<button type="button" class="btn btn-primary btn-sm" id="btn-add">新增</button>');

            /*]]>*/

            //查询按钮
            $("#btn-query").on("click", function () {
                tables.fnDraw();
            });

            var url="/ka/edit";
            //添加
            $("#btn-add").on("click", function () {
                if($("#agencyId").val()) {
                    $("#editModal input[name=kaId]").val(null);
                    $("#editModal input[name=kaName]").val("");
                    $("#editModal input[name=loginName]").val("");
                    $("#editModal input[name=contactName]").val("");
                    $("#editModal input[name=contactPhone]").val("");
                    $("#editModal input[id=accountName]").val("");
                    $("#editModal input[id=bank]").val("");
                    $("#editModal input[id=accountNumber]").val("");

                    $("#myModalLabel2").text("KA-新增");
                    $("#editModal").modal("show");
                }else{
                    toastr.error("您不能创建KA账户，请联系代理商创建！");
                }
            });
            $('#profitModal').on('hide.bs.modal', function () {
                $("#rateforSubmit  input").remove();
                $("#profitTable tr:gt(0)").remove();
            });

            $("#dataTable tbody").on("click","#profitRow",function () {
                var data = tables.api().row($(this).parents("tr")).data();
                /*<![CDATA[*/
                $.ajax({
                    url: '/ka/getRatelist',
                    type: 'POST',
                    data: {"foreignId":data.kaId},
                    dataType: "json",
                    cache: "false",
                    success: function (result) {
                        if (result.result == 200 && result .data.length>0) {
                            $.each(result .data,function(i,n){
                                $("#profitTable").append("<tr><td>"+n.provinceName+"&nbsp;&nbsp;"+n.cityName+"</td><td>"+n.rate+"</td><td><a href='javascript:;'proid='"+n.profitId+"' onclick='deleteByPid("+i+",this);'>删除</a> <a href='javascript:;' onclick='editByPid("+i+","+n.profitId+",this);'>修改</a></td></tr>");
                                $("#rateforSubmit").append("<input type='hidden' name='ratelist["+i+"].profitId'value='"+n.profitId+"'/><input type='hidden' name='ratelist["+i+"].provinceId'value='"+n.provinceId+"'/>"+
                                    "<input type='hidden' name='ratelist["+i+"].provinceName' value='"+n.provinceName+"'/>"+
                                    "<input type='hidden' name='ratelist["+i+"].cityId' value='"+n.cityId+"'/>"+
                                    "<input type='hidden' name='ratelist["+i+"].cityName' value='"+n.cityName+"'/><input type='hidden' name='ratelist["+i+"].rate' value='"+n.rate+"'/>");
                            })
                            i= result .data.length;
                        }
                    },
                    error: function (err) {
                        toastr.error("网络错误...");
                    }
                });
                $("#rateforSubmit").append("<input type='hidden' name='foreignId' value='"+data.kaId+"'/><input type='hidden' name='setType' value='2'/>")
                /*]]>*/
                $("#profitModal").modal("show");
            });
            var i = 0;
            $("#profit-add").click(function () {
                var proId =  $("#selProvince").val();
                if(proId == 0){
                    alert("请选择省份");
                    return;
                }
                var cityId = $("#selCity").val();
                if(cityId == 0){
                    alert("请选择市");
                    return ;
                }
                var pro = $("#selProvince").find("option:selected").text();
                var city = $("#selCity").find("option:selected").text();
                var rate = $("#rate").val();
                if(!rate){
                    alert("请输入佣金比例");
                    return ;
                }
                /*<![CDATA[*/
                $("#profitTable").append("<tr><td>"+pro+"&nbsp;&nbsp;"+city+"</td><td>"+rate+"</td><td><a href='javascript:;' onclick='deletethis("+i+",this);'>删除</a> <a href='javascript:;' onclick='edittempRate("+i+",this)'>修改</a></td></tr>")
                $("#rateforSubmit").append("<input type='hidden' name='ratelist["+i+"].profitId'value=''/><input type='hidden' name='ratelist["+i+"].provinceId'value='"+proId+"'/>"+
                    "<input type='hidden' name='ratelist["+i+"].provinceName' value='"+pro+"'/>"+
                    "<input type='hidden' name='ratelist["+i+"].cityId' value='"+cityId+"'/>"+
                    "<input type='hidden' name='ratelist["+i+"].cityName' value='"+city+"'/><input type='hidden' name='ratelist["+i+"].rate' value='"+rate+"'/>");
                $("#selProvince").val("0");
                $("#selCity").val("0");
                $("#rate").val("");
                i++;
                /*]]>*/
            })
            $("#profit-submit").click(function () {
                $.ajax({
                    url: '/ka/saveRatelist',
                    type: 'POST',
                    data: $("#submitForm").serialize(),
                    dataType: "json",
                    cache: "false",
                    success: function (result) {
                        if (result.result == 200) {
                            $("#profitModal").modal("hide");
                            toastr.success(result.msg);
                            $("#rateforSubmit input").remove();
                            i=0;
                        } else {
                            toastr.error(result.msg);
                            //bootbox.alert(result.msg);
                        }
                    },
                    error: function (err) {
                        toastr.error("网络错误...");
                    }
                });
            })

            //修改
           $("#dataTable tbody").on("click", "#editRow", function () {

                var data = tables.api().row($(this).parents("tr")).data();
                var accountName = data.qhsAccountInfo.accountName;
                var bank = data.qhsAccountInfo.accountName;
                var accountNumber = data.qhsAccountInfo.accountNumber;

               $("#editModal input[name=kaId]").val(data.kaId);
               $("#editModal input[name=kaName]").val(data.kaName);
               $("#loginName").attr("readonly","readonly");
               $("#editModal input[name=loginName]").val(data.loginName);
               $("#editModal input[name=contactName]").val(data.contactName);
               $("#editModal input[name=contactPhone]").val(data.contactPhone);
               $("#editModal input[id=accountName]").val(accountName);
               $("#editModal input[id=bank]").val(bank);
               $("#editModal input[id=accountNumber]").val(accountNumber);

                $("#editModal").modal("show");
            });
            $("#btn_close").click(function () {
                $("#editModal").css('display','none');
                $("#loginName").removeAttr("readonly");
            });
            var validator = $("#editForm").validate();
            //添加、修改  表单异步提交
            $("#btn-submit").on("click", function(){
                if(validator.form()) {
                    $.ajax({
                        cache: false,
                        type: "POST",
                        url: url,
                        data: $("#editForm").serialize(),
                        dataType: "json",
                        async: false,
                        error: function (request) {
                            toastr.error("网络错误...");
                        },
                        success: function (data) {
                            //   data = $.parseJSON(data);
                            if (data.result == "200") {
                                $("#editModal").modal("hide");
                                tables.fnDraw();
                                toastr.success(data.msg);
                                if ($("#loginName").attr("readonly")) {
                                    $("#loginName").removeAttr("readonly");
                                }
                            } else {
                                toastr.error(data.msg);
                            }
                        }
                    });
                }
            });


            //删除
            $("#dataTable tbody").on("click", "#delRow", function () {
                var data = tables.api().row($(this).parents("tr")).data();
                bootbox.confirm(
                        {
                            message: "确认要删除吗",
                            buttons: {
                                confirm: {
                                    label: '确认'
                                },
                                cancel: {
                                    label: '取消'
                                }
                            },
                            callback: function (result) {
                                // 返回 true  或者false
                                if (result) {
                                    $.ajax({
                                        url: '/ka/delete',
                                        type: 'POST',
                                        data: {"kaId": data.kaId},
                                        dataType: "json",
                                        cache: "false",
                                        success: function (result) {
                                            if (result.result == 200) {
                                                toastr.success(result.msg);
                                                tables.api().row().remove().draw(false);
                                            } else {
                                                toastr.error(result.msg);
                                            }
                                        },
                                        error: function (err) {
                                            toastr.error("网络错误...");
                                        }
                                    });
                                }
                            }
                        });


            });

            /*<![CDATA[*/
            $.each(province, function (k, p) {
                var option = "<option value='" + p.ProID + "'>" + p.ProName + "</option>";
                $("#selProvince").append(option);
            });

            $("#selProvince").change(function () {
                var selValue = $(this).val();
                $("#selCity option:gt(0)").remove();

                $.each(city, function (k, p) {
                    if (p.ProID == selValue) {
                        var option = "<option value='" + p.CityID + "'>" + p.CityName + "</option>";
                        $("#selCity").append(option);
                    }
                });

            });

            $("#selCity").change(function () {
                var selValue = $(this).val();
                $("#selDistrict option:gt(0)").remove();

                $.each(District, function (k, p) {
                    if (p.CityID == selValue) {
                        var option = "<option value='" + p.Id + "'>" + p.DisName + "</option>";
                        $("#selDistrict").append(option);
                    }
                });
            });
            /*]]>*/

        })
        function deletethis(line,obj) {
            $(obj).parent().parent().remove();
            /*<![CDATA[*/
            $("#rateforSubmit input[name='ratelist\["+line+"\].provinceId']").remove();
            $("#rateforSubmit input[name='ratelist\["+line+"\].provinceName']").remove();
            $("#rateforSubmit input[name='ratelist\["+line+"\].cityId']").remove();
            $("#rateforSubmit input[name='ratelist\["+line+"\].cityName']").remove();
            $("#rateforSubmit input[name='ratelist\["+line+"\].rate']").remove();
            /*]]>*/
        }
        function deleteByPid(line,obj) {
            var profitId = $(obj).attr("proid");
            $.ajax({
                url: '/ka/deleteRate',
                type: 'POST',
                data: {"profitId": profitId},
                dataType: "json",
                cache: "false",
                success: function (result) {
                    if (result.result == 200) {
                        $(obj).parent().parent().remove();
                        /*<![CDATA[*/
                        $("#rateforSubmit input[name='ratelist\["+line+"\].profitId']").remove();
                        $("#rateforSubmit input[name='ratelist\["+line+"\].provinceId']").remove();
                        $("#rateforSubmit input[name='ratelist\["+line+"\].provinceName']").remove();
                        $("#rateforSubmit input[name='ratelist\["+line+"\].cityId']").remove();
                        $("#rateforSubmit input[name='ratelist\["+line+"\].cityName']").remove();
                        $("#rateforSubmit input[name='ratelist\["+line+"\].rate']").remove();
                        /*]]>*/
                    } else {
                        toastr.error(result.msg);
                    }
                },
                error: function (err) {
                    toastr.error("网络错误...");
                }
            });
        }
        function editByPid(line,profitId,obj) {
            $(obj).parent().prev().text("");
            /*<![CDATA[*/
            $(obj).parent().prev().append("<input type='text' name='tempRate'/><button  type='button' style='width: 75px;height: 21px;font-size: 12px;text-align: center;padding-top: 2px;' class='btn btn-primary ' onclick='ensureEdit("+line+",this);'>确定</button>")
            /*]]>*/
        }
        function ensureEdit(line,obj) {
            var rate = $(obj).parent().find("input").val();
            $("#rateforSubmit input[name='ratelist\["+line+"\].rate']").val(rate);
            $(obj).parent().find("input").remove();
            $(obj).parent().append(rate);
            $(obj).remove();
        }
        function edittempRate(line,obj) {
            $(obj).parent().prev().text("");
            /*<![CDATA[*/
            $(obj).parent().prev().append("<input type='text' name='tempRate'/><button  type='button' style='width: 75px;height: 21px;font-size: 12px;text-align: center;padding-top: 2px;' class='btn btn-primary ' onclick='ensureEdit("+line+",this);'>确定</button>")
            /*]]>*/
        }
    </script>


</div>
</body>
</html>